<!--  -->
<template>
  <div class='demo_warp'>
      <div>
           (1)年频={{time1}}
      <div>
           <el-date-picker
          size="mini"
          @change="datevaluechange"
          v-model="time1"
          :type="time1_type"
          :value-format="time1_valueformat"
          placeholder="选择时间"
          :picker-options='pickerOptions_Month'
        >
        </el-date-picker>
      </div>
      (2)季频={{time2}}
      <div>
           <el-date-picker
          size="mini"
          @change="datevaluechange"
          v-model="time2"
          :type="time2_type"
          :value-format="time2_valueformat"
          placeholder="选择时间"
          :picker-options='pickerOptions_Month'
        >
        </el-date-picker>
      </div>
      (3)周频{{time3}}
      <div>
           <el-date-picker
          size="mini"
          @change="datevaluechange"
          v-model="time3"
          :type="time3_type"
          :value-format="time3_valueformat"
          placeholder="选择时间"
          :picker-options='pickerOptions'
        >
        </el-date-picker>
      </div>
      </div>
     
  </div>
</template>

<script>
export default {
  data () {
    return {
        time1:'',
        time1_type:'year',
        time1_valueformat:'yyyy',
        time2:'',
        time2_type:'month',
        time2_valueformat:'yyyy-MM',
        time3:'',
        time3_type:'date',
        time3_valueformat:'yyyy-MM-dd',
         pickerOptions: {
          disabledDate(time) {
            return time.getDay() !== 0;
          }
        },
        pickerOptions_Month: {
          disabledDate(time) {
            return time.getMonth()!=2&&time.getMonth()!=5&&time.getMonth()!=8&&time.getMonth()!=11
          }
        },
    };
  },

  components: {},

  computed: {},

  mounted(){},

  methods: {
      datevaluechange(){}
  }
}

</script>
<style lang='scss' scoped>
.demo_warp{
    width: 100%;
    height:200px;
    display: flex;
    justify-content: center;
    color: #000;
    font-size: 14px;
}
</style>